<!DOCTYPE html>
<html>
    <head>
        <!-- 页面meta -->
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>管理员密码修改</title>
        <meta name="description" content="管理员密码修改">
        <meta name="keywords" content="管理员密码修改">
        <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
        <!-- 引入样式 -->
        <link rel="stylesheet" href="../js/elementui/index.css">
        <link rel="stylesheet" href="../js/font-awesome/css/font-awesome.min.css">
        <link rel="stylesheet" href="../css/backendcss/style.css">
    </head>
    <body class="hold-transition">
        <div id="app">
            <div class="content-header">
                <h1>管理员密码修改<small>系统管理</small></h1>
                <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
                    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item>系统管理</el-breadcrumb-item>
                    <el-breadcrumb-item>管理员密码修改</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <div class="app-container">
                <div class="box">
                    <el-form ref="form" :model="form" label-width="80px" :rules="rules">
                        <el-form-item label="用户id" v-show="userid" >
                            <el-input v-model="form.id" ></el-input>
                        </el-form-item>
                        <el-form-item label="用户名" v-show="userid">
                            <el-input v-model="form.username"></el-input>
                        </el-form-item>
                        <el-form-item label="新密码">
                            <el-input v-model="form.password" show-password></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="onSubmit">提交</el-button>
                            <el-button>取消</el-button>
                        </el-form-item>
                    </el-form>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <!-- 引入组件库 -->
    <script src="../js/vue/vue.js"></script>
    <script src="../js/elementui/index.js"></script>
    <script type="text/javascript" src="../js/jquery-3.4.1.min.js"></script>
    <script src="../js/vue/axios-0.18.0.js"></script>
    <script>
        var vue = new Vue({
            el: '#app',
            data:{
                userid:false,
                form: {
                    id: '',
                    username: '',
                    password: ''
                },
                rules: {//校验规则
                    password: [{ required: true, message: '密码为必填项', trigger: 'blur' }]
                }
            },

            //钩子函数，VUE对象初始化完成后自动执行
            created() {
               this.checkprofile();
            },
            methods: {
                // 检查当前管理员信息，并向表格填充
                checkprofile(){
                    console.log("开始查询个人信息");
                    axios.post("/backendlogin/checkLogin.do").then(res=>{
                        console.log(res);
                        this.form = res.data.objectMap.powerUser;
                        this.form.password = "";
                    })},
                //编辑
                onSubmit() {
                    console.log("开始提交");
                    console.log(this.form);
                    axios.post("/backendlogin/update.do",this.form).then(res=>{
                        if(res.data.errorCode==="100"){
                            this.$message({message:'修改成功，将在重新登录后生效！',type:'success'});
                        }else{
                            this.$message({message:'修改失败！',type:'warning'});
                        }
                    })
                },

            }
        })
    </script>
</html>